<template>
	<view class="wrap">
    <fa-navbar title="酒店信息" :border-bottom="false"></fa-navbar>
    <view class="bgff paddLR">
      <view class="tit2">入住须知</view>
      <view class="u-666 z-line-2">
        <view>入住时间:14:00以后 离店时间:12:00以前</view>
        <view>接待大陆、港澳台及外国客人</view>
      </view>
    </view>
    <view class="bgff paddLR sheshi-box">
      <view class="tit2">设施服务</view>
      <view class="u-flex u-col-center u-flex-wrap ">
        <view v-for="(item, index) in sheshi" :key="index" class="item u-flex u-col-center">
          <u-image v-if="item.image" :src="item.image" width="30rpx" height="30rpx"></u-image>
          <text class="u-m-l-10">{{item.name}}</text>
        </view>
      </view>
    </view>
    <view class="bgff paddLR">
      <view class="tit2">酒店介绍</view>
      <view class="u-flex u-col-center u-flex-wrap">
        <view class="w5 u-m-b-15"><text class="u-999">开业时间：</text>2021年03月01日</view>
        <view class="w5 u-m-b-15"><text class="u-999">装修时间：</text>2021年03月01日</view>
        <view class="w5 u-m-b-15"><text class="u-999">客房总数：</text>101间</view>
      </view>
      <view class="u-666 z-line-2">
        <u-parse :html="content"></u-parse>
      </view>
    </view>
    <view class="bgff paddLR">
      <view class="tit2">周边娱乐</view>
      <view class="u-666 z-line-2">
        <u-parse :html="content"></u-parse>
      </view>
    </view>
  </view>
</template>
<style lang="scss" scoped>
  .sheshi-box{
    .item{width: 33%; line-height: 1.2; font-size: 24rpx; color: #666; margin-bottom: 14rpx;}
  }
  .paddLR{padding-top: 30rpx; padding-bottom: 30rpx; margin-bottom: 16rpx;}
</style>
<script>
	export default {
		data() {
			return {
        sheshi:[
          {id:1, name:'有浴缸',image: 'https://cdn.uviewui.com/uview/swiper/1.jpg'},
          {id:2, name:'寄存行李',image: 'https://cdn.uviewui.com/uview/swiper/1.jpg'},
          {id:3, name:'安全报警器',image: 'https://cdn.uviewui.com/uview/swiper/1.jpg'},
          {id:4, name:'WIFI',image: 'https://cdn.uviewui.com/uview/swiper/1.jpg'},
          {id:5, name:'有浴缸',image: 'https://cdn.uviewui.com/uview/swiper/1.jpg'},
          {id:6, name:'寄存行李',image: 'https://cdn.uviewui.com/uview/swiper/1.jpg'},
          {id:7, name:'安全报警器',image: 'https://cdn.uviewui.com/uview/swiper/1.jpg'},
          {id:4, name:'WIFI',image: 'https://cdn.uviewui.com/uview/swiper/1.jpg'},
        ],
        content:'对于轻量、简单的字符串，rich-text性能更好<br>对于复杂的字符串，使用parse组件效果更好，有更多的自定义属性和效果<br>总结：如果是简单的场景，比如一段简单的文字和图片内容，可以优先使用rich-text组件，在文章内容，商品详情等复杂的文本详情，可以优先使用',
        
        banner: [
          {
            image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
            title: '昨夜星辰昨夜风，画楼西畔桂堂东',
            name:'劳斯莱斯酒店劳斯莱斯酒店劳斯莱斯酒店劳斯莱斯酒店劳斯莱斯酒店'
          },
          {
            image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
            title: '身无彩凤双飞翼，心有灵犀一点通',
            name:'支付宝哈罗酒店'
          },
          {
            image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
            title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳',
            name:'天天向上酒店'
          },{
            image: 'https://cdn.uviewui.com/uview/swiper/1.jpg',
            title: '昨夜星辰昨夜风，画楼西畔桂堂东',
            name:'劳斯莱斯酒店劳斯莱斯酒店劳斯莱斯酒店劳斯莱斯酒店劳斯莱斯酒店'
          },
          {
            image: 'https://cdn.uviewui.com/uview/swiper/2.jpg',
            title: '身无彩凤双飞翼，心有灵犀一点通',
            name:'支付宝哈罗酒店'
          },
          {
            image: 'https://cdn.uviewui.com/uview/swiper/3.jpg',
            title: '谁念西风独自凉，萧萧黄叶闭疏窗，沉思往事立残阳',
            name:'天天向上酒店'
          },
        ],
        
			}
		},
    onReady(){
      
    },
    watch: {
      // watch第一次绑定值的时候不会执行监听，修改数据才会触发函数
      dateRange(newVal,oldVal) {
        console.log('oldVal:',oldVal)   // coderkey
        console.log('newVal:',newVal)   // pink
        this.getDayOfWeek(newVal)
      }
    },
		methods: {
      
		}
	}
</script>